import React from 'react'
import { nanoid } from 'nanoid';
import './index.css'
// import PropTypes from 'prop-types'
export default function Header(props) {

  let handerKeyUp = (event)=>{
    if(event.keyCode !== 13 ) return;
    if(event.target.value.trim()=== ''){
      alert('输入不能为空')
      return;
    }
    const todoObj = {id:nanoid(), name:event.target.value, done: false}
    props.addTodo(todoObj)
    event.target.value = ''
    
  }
  return (
    <div className="todo-header">
      <input onKeyUp={handerKeyUp}  type="text" placeholder="请输入你的任务名称，按回车键确认"/>
  </div>
  )
}

